<!doctype html>
<html lang="en">
<head>
<title>A web page</title>
<style>

h1
{
	font-family: Georgia, “Times New Roman”, serif;
	font-size: 30px;
	color: #7924ff;
	font-style: italic;
	font-weight: bold;
}

h2
{
  font-family: "Lucida Console", Monaco, monospace;
  font-size: 20px;
  color: teal;
}

p, li
{
	
	font-family: Helvetica, Arial, sans-serif;
	font-size: 16px;
}

em
{
	text-decoration: underline;	
	font-style: normal;
}

strong
{
	font-weight: bold;
	color: red;
}


li 
{
	list-style-type: square;
}

a
{
	color: green;
	text-decoration: none;
}

a:hover
{
	background-color: black;
	color: white;
}

img
{
  width: 250px;
	height: auto;
	border-style: dashed;
	border-width: 2px;
	border-color: navy;
	padding: 10px;
}

</style>
</head>

<body>
<h1>A simple web page</h1>
<p>Everything you see on this page was made using basic HTML tags.</p>

<h2>This is a sub-heading</h2>
<p>You use HTML tags to <em>structure information</em>. This is a paragraph of text structured with a p tag.</p>

<h2>Making lists</h2>
<p>You can also use tags to <strong>make a list</strong> of things.</p>
<ul>
  <li>First item</li>
  <li>Second item</li>
  <li>Third item</li>
</ul>

<!-- This is a comment in the document. It won't appear in the web browser-->

<h2>Adding links</h2>
<p>Its easy to create hyperlinks to other web pages, or to create a link to generate an email. Here's how:</p>
<ul>
  <li><a href="http://www.w3schools.com" target="_blank">Here's a good resource</a> for learning HTML.</li>
  <li>If you want to say Hi, <a href="mailto:hello@kittykatattack.com?Subject=Hello%20there!">Send me an email</a>.</li>
</ul>

<p>Add a photo with an img tag, like this:</p>
<img src="ocean.jpg" alt="A photo of the ocean">

</body>
</html>